<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Simulação de uma Fila M/M/1</title>

<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="css/jqueryui/jquery-ui-1.8.22.custom.css" rel="stylesheet" type="text/css">
<link href="layout.css" rel="stylesheet" type="text/css">

<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.8.22.custom.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/bootstrap-responsive.min.js" type="text/javascript"></script>
<script src="js/highcharts.js" type="text/javascript"></script>
<script src="js/move.js" type="text/javascript"></script>
<script src="simulador.js" type="text/javascript"></script>
<script src="eventos.js" type="text/javascript"></script>
<script src="main.js" type="text/javascript"></script>

</head>
<body>
	<div id="wrapper" class="page-header">
		<div id="primeira_parte">
			<div id="coluna1" style="width: 40%; height: 400px; float: left;">
				<img src="img/fundo_fila.png"></img>
			</div>
			<div id="coluna2" style="width: 60%; height: 400px; float: left;">
				<h1>Simulador
					<input type="button" onclick="init();" value="Reiniciar">
					<img src="img/play.png" class="buttons" id="play"></img>
					<img src="img/pause.png" class="buttons" id="pause"></img>
					<img src="img/next.png" class="buttons" id="passo"></img>
					<img src="img/stop.png" class="buttons" id="stop"></img>
				</h1>
				<div id="simulador">
					<br>
					<br>
					<h3>Taxas</h3>
					Chegada &lambda; = <input type="text" value="0.9" style='width:2em' id="taxa_chegada"/> clientes/minuto<br>
					Serviço &mu; = <input type="text" value="0.5" style='width:2em' id="taxa_saida"/> clientes/minuto<br>
					<br>
					<br>
					<h3>Tipos de Eventos</h3> <span class="badge">Chegada</span> <span class="badge badge-info">Término de Serviço</span> 
					<br>
					<br>
					<h3>Fila de Eventos
						<small class="alert">
							Há sempre 1 evento de cada tipo na fila de eventos
						</small>
					</h3>
					<ul class="breadcrumb">
						<li class="active"><a disabled="disabled"><span id="evento0"></span></a><span class="divider">  |  </span></li>
						<li><a disabled="disabled"><span id="evento1"></span></a></li>
					</ul>
					<h3>Atual</h3>
					<span id="relogio"></span> .:. <span id="evento"></span>
				</div>
			</div>
		</div>
		<br>
		<br>
		<br>
		<br>
		<div id="segunda_parte">
			<div id="fila">
				<div id="entrada"></div>
				<div id="fila_espera">
					<div id="atendente" class="atendente"></div>
				</div>
			</div>
		</div>
	</div>
	<div id="estatistica" style="display: none;">
		<div id="grafico" style="width: 600px; height: 300px;"></div>
	</div>
</body>
</html>
